import React, { useState } from "react";
import SearchInput from "./components/SearchInput/index";
import SearchResultList from "./components/ResultList/index";
import { View } from "react-native";
import { styles } from "./styles/index.style";
import { Contact, GroupChat } from "./types/index";
import { router } from "expo-router";


/**
 * @author FlanChan
 * 用户个人资料来源
 */
export enum SourceType {
    APPLY_LIST = 'applyList',
    CHAT_DETAIL = 'chatDetail',
    UUID = 'uuid'
}

/**
 * Design Beloved
 * @readMe 该组件用于展示搜索结果列表，包括联系人和群聊中存在的联系人类似于微信的多级联动搜索。
 *
 * @SearchComponent
 * @param searchText - 搜索文本
 * @param contacts[] - 联系人列表
 * @param groupChats[] - 群聊列表
 * @param onItemPress - 点击联系人或群聊的回调函数
 * @param onAddNew - 点击添加新联系人的回调函数
 * @example
 */
const SearchComponent = () => {
  const [searchText, setSearchText] = useState("");
  const mockContacts: Contact[] = [
    { id: "1", name: "Alice", group: "Design Team", verified: true },
    { id: "2", name: "Bob", group: "Engineering" },
  ];

  const mockGroups: GroupChat[] = [
    { id: "g1", name: "Mobile Team", members: 12 },
  ];
  return (
    <View style={styles.container}>
      <SearchInput onChange={setSearchText} value={searchText} />
      <SearchResultList
        searchText={searchText}
        contacts={mockContacts}
        groupChats={mockGroups}
        onItemPress={(item) => console.log("Selected:", item)}
        onAddNew={(text) => {
          router.navigate(`/userprofile/${text}/?type=${SourceType.UUID}`);
        }}
      />
    </View>
  );
};
export default SearchComponent;
